{% extends "base.html" %}
{# Copyright The IETF Trust 2015, 2020, All Rights Reserved #}
{% load origin %}
{% load cache %}
{% load ietf_filters static classname tz %}
{% block pagehead %}
    <link rel="stylesheet" href="{% static "ietf/css/list.css" %}">
{% endblock %}
{% block title %}Upcoming Meetings{% endblock %}
{% block content %}
    {% origin %}
    <h1>Upcoming Meetings</h1>
    {% include 'meeting/interim_nav.html' %}
    <div class="alert alert-info my-3">
        For more on regular IETF meetings, see
        <a href="https://www.ietf.org/meeting/upcoming.html">here</a>.
        <hr>
        Meeting important dates are not included in upcoming meeting calendars. They have
        <a href="{% url 'ietf.meeting.views.important_dates' %}">their own calendar</a>.
    </div>
    {% if menu_actions %}
        <div id="menu-actions" class="buttonlist my-3">
            {% for action in menu_actions %}
                <a class="btn btn-primary {% if action.append_filter %}agenda-link filterable{% endif %}"
                   href="{{ action.url }}">
                    {{ action.label }}
                </a>
            {% endfor %}
        </div>
    {% endif %}
    {% include 'meeting/tz-display.html' with id_suffix="" meeting_timezone=None only %}
    {% include 'meeting/agenda_filter.html' with filter_categories=filter_categories customize_button_text="Customize the meeting list..." only %}
    {% cache 600 upcoming-meetings entries.count %}
    {% if entries %}
        <table id="upcoming-meeting-table"
               class="table table-sm table-striped tablesorter">
            <thead>
                <tr>
                    <th scope="col" data-sort="date">Date</th>
                    <th scope="col" data-sort="group">Group</th>
                    <th scope="col" data-sort="meeting">Meeting</th>
                    <th scope="col"></th>
                </tr>
            </thead>
            <tbody>
                {% for entry in entries %}
                    <tr class="entry"
                        {% if entry|classname == 'Session' %}
                            data-filter-keywords="{{ entry.filter_keywords|join:',' }}"
                        {% elif entry|classname == 'Meeting' %}
                            data-filter-keywords="ietf-meetings"
                        {% endif %}
                    >
                        {% if entry|classname == 'Meeting' %}
                            {% with meeting=entry %}
                                <td class="meeting-time"
                                    data-start-date="{{ meeting.date }}"
                                    data-end-date="{{ meeting.end_date }}"
                                    data-time-zone="{{ meeting.time_zone }}">
                                    {{ meeting.date }} to {{ meeting.end_date }}
                                </td>
                                <td>ietf</td>
                                <td>
                                    <a class="ietf-meeting-link"
                                       href="{% url 'agenda' num=meeting.number %}">
                                        IETF {{ meeting.number }}
                                    </a>
                                </td>
                                <td></td>
                            {% endwith %}
                        {% elif entry|classname == 'Session' %}
                            {% with session=entry group=entry.group meeting=entry.meeting %}
                                <td class="session-time"
                                    data-start-utc="{{ session.official_timeslotassignment.timeslot.time | utc | date:'Y-m-d H:i' }}Z"
                                    data-end-utc="{{ session.official_timeslotassignment.timeslot.end_time | utc | date:'Y-m-d H:i' }}Z">
                                    {{ session.official_timeslotassignment.timeslot.time | utc | date:"Y-m-d H:i" }}-{{ session.official_timeslotassignment.timeslot.end_time | utc | date:"H:i" }}
                                </td>
                                <td>
                                    <a href="{% url 'ietf.group.views.group_home' acronym=group.acronym %}">{{ group.acronym }}</a>
                                </td>
                                <td>
                                    <a class="interim-meeting-link"
                                       href="{% url 'ietf.meeting.views.session_details' num=meeting.number acronym=group.acronym %}">
                                        {% firstof session.name meeting.number %}
                                    </a>
                                </td>
                                {% if session.current_status == 'canceled' %}
                                    <td class="text-end">
                                        <span class="badge rounded-pill text-bg-warning">Cancelled</span>
                                    </td>
                                {% else %}
                                    <td class="text-end">{% include "meeting/interim_session_buttons.html" with show_agenda=True %}</td>
                                {% endif %}
                            {% endwith %}
                        {% else %}
                            <td>
                                <span class="badge rounded-pill text-bg-warning">Unexpected entry type: {{ entry|classname }}</span>
                            </td>
                            <td></td>
                            <td></td>
                            <td></td>
                        {% endif %}
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    {% else %}
        <h3 class="my-3">No upcoming meetings</h3>
    {% endif %}
{% endcache %}
{% include 'meeting/tz-display.html' with id_suffix="-bottom" meeting_timezone=None only %}
<div id="calendar">
</div>
{% endblock %}
{% block js %}
    <script src="{% static 'ietf/js/list.js' %}"></script>
    <script src="{% static 'ietf/js/fullcalendar.js' %}"></script>
    <script src="{% static 'ietf/js/moment.js' %}"></script>
    <script src="{% static 'ietf/js/agenda_filter.js' %}"></script>
    <script src="{% static 'ietf/js/agenda_materials.js' %}"></script>
    <script src="{% static 'ietf/js/timezone.js' %}"></script>
    <script src="{% static 'ietf/js/upcoming.js' %}"></script>
    <script>
                var all_event_list = [{% for entry in entries %}
                  {% if entry|classname == 'Meeting' %}
                      {% with meeting=entry %}
                          {
                              ietf_meeting_number: '{{ meeting.number }}',
                              filter_keywords: ['ietf-meetings'],
                              start_moment: moment.tz('{{meeting.date}}', '{{ meeting.time_zone }}').startOf('day'),
                              end_moment: moment.tz('{{meeting.end_date}}', '{{ meeting.time_zone }}').endOf('day'),
                              url: '{% url 'agenda' num=meeting.number %}'
                          }{% if not forloop.last %}, {% endif %}
                      {% endwith %}
                  {% else %} {# if it's not a Meeting, it's a Session #}
                      {% with session=entry %}
                          {
                              group: '{% if session.group %}{{session.group.acronym}}{% endif %}{% if session.name %} - {{session.name}}{% endif %}',
                              current_status: '{{ session.current_status }}',
                              filter_keywords: ["{{ session.filter_keywords|join:'","' }}"],
                              start_moment: moment.utc('{{session.official_timeslotassignment.timeslot.time | utc | date:"Y-m-d H:i"}}'),
                              end_moment: moment.utc('{{session.official_timeslotassignment.timeslot.end_time | utc | date:"Y-m-d H:i"}}'),
                              url: '{% url 'ietf.meeting.views.session_details' num=session.meeting.number acronym=session.group.acronym %}'
                          }
                      {% endwith %}
                      {% if not forloop.last %}, {% endif %}
                  {% endif %}
                {% endfor %}];

        $(function () {
                // Init with best guess at local timezone.
                ietf_timezone.set_tz_change_callback(timezone_changed);
                ietf_timezone.initialize('local');

                // Set up the filtering - the callback will be called when the page loads and on any filter changes
                agenda_filter.set_update_callback(update_view);
                agenda_filter.enable();
        });
    </script>
{% endblock %}